<script setup>
import timeImg from '@/assets/bc/time/time.png';
 
const srcList = [
    timeImg,
]
</script>

<template>
    <div class="content-container">
        <div class="title">时间轴</div>


        <section>
            <div class="demo-image__preview">
                <el-image style="width: 400px; height: 400px;" :src=timeImg :zoom-rate="1.2" :max-scale="7"
                    :min-scale="0.2" :preview-src-list="srcList" :initial-index="4" fit="cover"/>
            </div>
        </section>
    </div>
</template>

<style lang="scss" scoped>
.content-container {
    padding: 20px;
    line-height: 1.6;
    font-family: 'Microsoft YaHei', sans-serif;
    background-color: #f9f9f9;
    border-radius: 8px;

    .title {
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        margin-bottom: 1.5rem;
        padding: 0.5rem;
        border-bottom: 2px solid #4A90E2;
        letter-spacing: 0.1rem;
    }

    .demo-image__preview {
        display: flex;
        justify-content: center;
        align-items: center;
        // width: 100%;
        // height: 100%;
    }
 
}

 
</style>